<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns:th="http://www.thymeleaf.org">
<body>
    <h3>Hi <span th:text="${taskInfo.owner}"></span> :</h3>
    <h2 style="width: 100%; text-align: center;">Kafka topic <a th:href="@{${taskInfo.approveURL}}"><span th:text="${taskInfo.topicName}"></span></a> Create Success.</h2>
    <br>
    <table align="center" style="border: 1px solid #555555;border-collapse: collapse;margin: 1px;width: 80%;text-align:center">
    	<tr><td style="color: black;font-size: 16px;text-align: center;background-color: rgb(227, 244, 253);height: 34px;border: 1px solid #555555;">Owner</td>
    	<td style="color: black;font-size: 16px;text-align: center;background-color: rgb(227, 244, 253);height: 34px;border: 1px solid #555555;"><span th:text="${taskInfo.owner}"></span></td></tr>
    	<tr><td style="color: black;font-size: 16px;text-align: center;background-color: rgb(253, 240, 230);height: 34px;border: 1px solid #555555;">TopicName</td>
    	<td style="color: black;font-size: 16px;text-align: center;background-color: rgb(253, 240, 230);height: 34px;border: 1px solid #555555;font-weight: bold;"><span th:text="${taskInfo.topicName}"></span></td></tr>
    	<tr><td style="color: black;font-size: 16px;text-align: center;background-color: rgb(227, 244, 253);height: 34px;border: 1px solid #555555;">Location</td>
    	<td style="color: black;font-size: 16px;text-align: center;background-color: rgb(227, 244, 253);height: 34px;border: 1px solid #555555;"><span th:text="${taskInfo.location}"></span></td></tr>
    	<tr><td style="color: black;font-size: 16px;text-align: center;background-color: rgb(253, 240, 230);height: 34px;border: 1px solid #555555;">MessageRate</td>
    	<td style="color: black;font-size: 16px;text-align: center;background-color: rgb(253, 240, 230);height: 34px;border: 1px solid #555555;"><span th:text="${taskInfo.messageRate}"></span></td></tr>
    	<tr><td style="color: black;font-size: 16px;text-align: center;background-color: rgb(227, 244, 253);height: 34px;border: 1px solid #555555;">Partition</td>
    	<td style="color: black;font-size: 16px;text-align: center;background-color: rgb(227, 244, 253);height: 34px;border: 1px solid #555555;"><span th:text="${taskInfo.partition}"></span></td></tr>
    	<tr><td style="color: black;font-size: 16px;text-align: center;background-color: rgb(253, 240, 230);height: 34px;border: 1px solid #555555;">Replication</td>
    	<td style="color: black;font-size: 16px;text-align: center;background-color: rgb(253, 240, 230);height: 34px;border: 1px solid #555555;"><span th:text="${taskInfo.replication}"></span></td></tr>
    	<tr><td style="color: black;font-size: 16px;text-align: center;background-color: rgb(227, 244, 253);height: 34px;border: 1px solid #555555;">TTL</td>
    	<td style="color: black;font-size: 16px;text-align: center;background-color: rgb(227, 244, 253);height: 34px;border: 1px solid #555555;"><span th:text="${taskInfo.ttl}"></span></td></tr>
    	<tr><td style="color: black;font-size: 16px;text-align: center;background-color: rgb(253, 240, 230);height: 34px;border: 1px solid #555555;align-items: left;">Comments</td>
    	<td style="color: black;font-size: 16px;text-align: center;background-color: rgb(253, 240, 230);height: 34px;text-align: left;font-weight: bold; border: 1px solid #555555;"><span th:text="${taskInfo.comments}"></span></td></tr>
    </table>
    <br>
    
	<table style="width:80%;border-collapse: collapse;text-align: center;" align="center" border="1">
		<tr style="background-color: rgb(162, 253, 154);">
		 	<th>ClusterName</th>
		 	<th>KafkaVersion</th>
			<th>Broker</th>
		</tr>
		<thead th:each="cluster : ${taskInfo.clusterMessList}" th:with="broker0 = ${cluster.brokerList.get(0)},brokerList = ${cluster.brokerList}">
			<tr>
				<td th:rowspan="${cluster.brokerSize}" th:text="${cluster.clusterName}"></td>
				<td th:rowspan="${cluster.brokerSize}" th:text="${cluster.clusterVersion}"></td>
				<td th:text="${broker0}"></td>
			</tr>
			<tr th:each="broker,stat : ${brokerList}" th:if="${!stat.first}">
				<td th:text="${broker}"></td>
			</tr>
		</thead>
	</table>
    <br>
	<br>
	<br>
	<div style="font-size: 15px;">
		<small>Best Regards</small>
		<div><b>CN XAEC Bigdata</b></div>
		<div style="margin: 18px 0;">
			<pre style="font-size: 8pt; font-family: Consolas; margin: 0;"> _  __      __ _            _____           _
| |/ /     / _| |          / ____|         | |
| ' / __ _| |_| | ____ _  | |     ___ _ __ | |_ ___ _ __
|  < / _` |  _| |/ / _` | | |    / _ \ '_ \| __/ _ \ '__|
| . \ (_| | | |   < (_| | | |___|  __/ | | | ||  __/ |
|_|\_\__,_|_| |_|\_\__,_|  \_____\___|_| |_|\__\___|_|
			</pre>
		</div>
	</div>
</body>
</html>